* { margin:0; padding:0; font-family:Tahoma, Helvetica, sans-serif;}
html { overflow-y:scroll;}
body { background:#fff url(bg.gif) 0 0 repeat-x; font-size:12px; line-height:150%;}

a { color:#06c;}
a:hover { color:#ff7031;}
img { border:1; vertical-align:middle;}
abbr { border-bottom:1px dashed #666; cursor:help;}
pre.code, code, var { font-family:"Courier New", Courier, monospace;}
pre.code { margin:.3em 0; padding:.3em .5em; border:1px solid #ccc; color:#666; white-space:pre-wrap; white-space:-moz-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word;}

/* form elements : base */
.input_text, textarea, select { border:1px solid; border-color:#7c7c7c #c3c3c3 #ddd; font-size:12px; line-height:120%;}
input, button, select { font-size:12px; vertical-align:middle;}
.input_text { height:15px; padding:3px 4px; line-height:15px;}
.formdisabled { border:1px solid #ccc; background:#eee;}
.input_file { height:23px;}
.empty { color:#ccc;}
input.formbutton { height:23px; padding:0 1.5em; border:1px solid; border-color:#66acff #094fa1 #094fa1 #66acff; background:#2680e9; color:#fff; letter-spacing:0.3em; cursor:pointer;}
button.formbutton { height:23px; padding:0 1.5em; border:1px solid; border-color:#66acff #094fa1 #094fa1 #66acff; background:#2680e9; color:#fff; letter-spacing:0.3em; cursor:pointer; line-height:23px;}
.formbutton:focus { border-color:#000;}
input.cancel { margin-left:2em;}
.inlinebutton { height:23px; padding:0 .5em; border:1px solid; border-color:#ccc #999 #999 #ccc; cursor:pointer;}
select { padding:2px 2px 2px 0; height:21px;}
option { padding:0 2px;}
textarea { padding:4px; overflow:auto;}

/* form elements : styling */
form p { margin:10px 0; line-height:23px;}
form p.error input, form p.error textarea { border-color:red;}
form p.error .formtip { font-weight:bold;}
form p.inputting .formtip { color:#000;}
form p.inputting .hint { color:#000;}
.formtip { color:#666;}

/* nf for normal forms */
.nf { clear:both;}
.nf h3 { width:400px; margin:.8em 0 .5em 170px; border-bottom:1px solid #eee; font-size:13px; color:#444;}
.nf .label_input { width:155px; margin-right:15px; float:left; text-align:right;}
.nf .label_check { margin-left:170px; cursor:pointer;}
.nf .input_text { width:200px;}
.nf:after, .nf p:after { content:"."; display:block; font-size:0; line-height:0; clear:both; visibility:hidden;}
.nf, .nf p { *zoom:1;}
.nf ul { list-style:none;}
.nf li { margin:.5em 0;}
.nf p.act { margin-left:170px;}
.nf p.note { width:400px; margin-left:170px; line-height:150%;}
.nf p.pending { width:384px; padding:7px 5px 7px 9px; margin-left:170px; border:1px solid #ccc; background:#eee;}
.nf span.hint { display:block; margin-left:170px; color:#666;}
.nf span.hidden { display:none;}
.nf p.err { color:red;}

/* vf for vertical forms */
.vf { width:300px; margin:0 auto;}
.vf label { font-weight:bold;}
.vf .label_input { display:block; float:none; text-align:left;}
.vf textarea { width:290px;}
.vf span.formtip { padding:0 .2em; color:#aaa;}

/* lf for large forms */
.lf p { line-height:26px;}
.lf label.label_input { font-size:14px; font-weight:normal;}
.lf label.label_check { font-weight:normal;}
.lf input.input_text { width:280px; height:18px; color:#444; font-size:14px; font-weight:bold; line-height:18px;}
.lf p.act a { font-weight:bold;}
.lf p.err { color:red;}
.lf span.url { font-size:13px;}
.lf input#url { width:12em;}

/* MODULE BLOCKS */
#container { width:775px; margin:1em auto 0;}
#container.impact { width:550px;}
#main { float:left; width:530px; overflow:hidden;}
.pu #container { width:100%;}
.pu .np #main { padding:0;}
.wp #main { width:100%;}
.np #main { clear:both; float:none; margin:0 auto; padding-top:20px;}
span.content a.former { color:#555;}
span.content a.former:hover { color:#ff7031;}
span.ajaxprompt { position:absolute; padding:0 1em; color:#fff; background:#0cf; font-weight:bold; line-height:1.65em;}

/* header */
#header { float:left; width:100%; padding:.25em 0 1.25em; clear:both;}
#header h1 { float:left; width:225px; font-weight:bold;}
#header h1 a { display:block; text-decoration:none;}
#header h1 a span { display:none; margin-left:.5em; font-size:13px; font-weight:normal;}
#header h1 a:hover span { display:inline; color:#fff;}
#navigation { float:right; height:35px; margin:.5em 0 0; padding-left:10px; background:url(navl.gif) 0 0 no-repeat; font-size:14px; line-height:35px; white-space:nowrap;}
#navigation ul { float:left; list-style:none; padding-right:10px; background:url(navr.gif) 100% 0 no-repeat;}
#navigation li { float:left; background:#fff;}
#navigation li a { padding:0 .8em;}
#navigation li.new a { padding-right:1.85em; background: url(new.gif) 100% 20% no-repeat;}

/* sidebar */
#sidebar { float:right; width:205px; padding:15px 10px 20px 18px; border:1px solid #89d5ef; background:#fff;}
#sidebar ul { list-style:none;}
#sidebar .sect { margin:0 0 1.5em;}
#sidebar h2 { margin:0 0 0 -10px; padding:8px 5px 5px 10px; background:url(secthd.gif) 0 0 no-repeat; font-size:14px; font-weight:normal;}
#sidebar h3 { font-size:13px; font-weight:normal;}
#sidebar #dashboard { font-size:13px;}
#sidebar #dashboard li { margin:5px 0;}
#sidebar #dashboard li.reminder { margin:8px 0; font-size:14px;}
#sidebar #dashboard li.reminder a { padding:3px 3px 0; border-bottom:2px solid #ffed00; background:#fffcaa; text-decoration:none;}
#sidebar p { margin:5px 0;}
#sidebar p.iconset img { margin-right:5px;}
#sidebar textarea { width:195px;}

#sidebar #apis { list-style:none;}
#sidebar #apis li a { padding-left:20px;}
#sidebar #apis li.rss { background:url(feed-icon.png) 0 50% no-repeat;}

#sidebar form#login p { margin:10px 0;}
#sidebar form#login .label_input { float:left; width:50px; color:#666; text-align:left;}
#sidebar form#login .label_check { margin-left:50px; color:#666; cursor:pointer;}
#sidebar form#login .input_text { width:135px;}
#sidebar form#login p.act { margin-left:50px;}
#sidebar form#login p#forgot { margin-left:50px;}
#sidebar #register p { text-align:center;}

/* footer */
#footer { clear:both; padding:1em 0; text-align:center;}
#footer p { margin:1em 0;}
#footer a { margin:0 .5em;}
#miibeian { color:#ccc; text-decoration:none;}

/* content */
#content { padding:10px; border:1px solid #89d5ef; background:#fff;}
#content.impact { padding:0;}
#content h2 { padding:5px 10px; border-bottom:1px solid #ccc; color:#444; font-size:15px;}
#content.impact h2 { padding:8px 15px;}

/* MODULE BLOCKS */
.sysmsg { clear:both; margin:0 0 10px; padding:5px 10px; border:1px solid #ffed00; background:#fffcaa; font-size:14px;}
.sysmsg p { margin:5px 0; line-height:20px;}
.sysnotice { clear:both; margin:0 0 10px; padding:5px 10px; border:1px solid #ffed00; background:#fffcaa;}
.sysnotice ul { padding-left:15px; line-height:165%;}
p.guide { margin:5px 10px;}

/* tabs */
.tabs { position:relative; top:1px; font-size:14px;}
.tabs:after { content:"."; display:block; font-size:0; line-height:0; clear:both; visibility:hidden;}
.tabs { *zoom:1;}
.tabs a.crumb {float:left; margin:7px 0 0; padding: 0 .5em; font-size:12px;}
.tabs ul { float:right; list-style:none;}
.tabs li { float:left; margin:0 0 0 .35em;}
.tabs li a { float:left; margin:5px 0 0; padding:2px 14px; background:#89d5ef; border:1px solid #89d5ef; color:#000; text-decoration:none;}
.tabs li a:hover { background:#fff; color:#ff7031;}
.tabs li.current a { margin:0; padding:6px 16px 4px; border:1px solid #89d5ef; border-bottom:0; background:#fff;}
.wp .tabs ul { float:left;}
.wp .tabs li { margin:0 .35em 0 0;}

/* stream */
#stream h3 { padding:5px; color:#444; font-size:14px; border-bottom:1px solid #ccc;}
#stream ol { list-style:none;}
#stream li { padding:10px 5px; border-bottom:1px solid #ccc; font-size:14px; overflow:hidden; -o-text-overflow:ellipsis;}
#stream li a.avatar { float:left; margin-left:-57px; overflow:hidden;}
#stream li span.content { word-break:break-all;}
#stream li span.content a.photo { float:right; overflow:hidden;}
#stream li span.op { margin-left:.3em;}
#stream li span.op a { font-size:12px; color:#999;}
#stream li span.op a:hover { color:#ff7031;}
#stream .wa li { padding:5px 5px 5px 62px;}
#stream .wa li.sys { padding:10px 5px 10px 62px;}
#stream li:after, #stream .wa li:after { content:"."; display:block; font-size:0; line-height:0; clear:both; visibility:hidden;}
#stream li, #stream .wa li { *zoom:1;}
#stream li span.avatar { float:left; margin-left:-55px; overflow:hidden;}
#stream.message li a.avatar img { display:block; width:48px; height:48px;}
#stream.message li a.author { float:left; margin-right:.3em;}
#stream.message li span.content a.photo img { display:block; width:72px;}
#stream.search li { padding:5px 5px 5px 120px;}
#stream.search li a.avatar { margin-left:-110px;}
#stream.search li a.avatar img { width:96px; height:96px;}
#stream.search li dl { width:400px; margin:.3em 0; float:left;}
#stream.search li dt { margin:.2em 0; font-weight:bold;}
#stream.search li dd { margin:.15em 0; font-size:12px;}
#stream.search li dd label { float:left; width:5em;}
#stream.search p.actions { float:right; width:200px; margin:.5em 1.5em 0 0; text-align:right;}
.stamp { color:#999; margin-left:1em; font-size:12px;}
.stamp a { color:#999;}
.stamp a:hover { color:#ff7031;}

/* images styles */
a.avatar img, a.photo img { padding:1px; border:1px solid #ccc; background:#fff;}
a.avatar:hover img, a.photo:hover img { border:1px solid #ff7031;}

/* avatar list */
.alist { list-style:none;}
.alist li { float:left; margin:0 3px 3px 0;}/* 4 imgs in a row takes 204px */
.alist:after { content:"."; display:block; font-size:0; line-height:0; clear:both; visibility:hidden;}
.alist li a { float:left; width:48px; height:64px; overflow:hidden; text-decoration:none;}
.alist li a img { height:48px;}
.alist li a span { display:block; text-align:center; line-height:150%; white-space:nowrap;}
.alist { *zoom:1;}

#sidebar .tlist { list-style:disc; padding-left:15px;}
#sidebar .tlist li { margin-bottom:.5em;}

/* page navigator */
.paginator { list-style:none; padding:10px 0; text-align:center;}
.paginator li { margin:0 .2em; display:inline;}
.paginator li.current { margin:0 .5em; font-weight:bold;}
.paginator li a { padding:2px 5px; border:1px solid #ddd; text-decoration:none;}
.paginator li a:hover { border-color:#ccc; background:#06c; color:#fff;}

/* board */
#content .board { width:500px; margin:1em auto 2em; font-size:12px; line-height:150%;}
#content .board h2 { margin:10px 0; padding:5px 0;}
#content .board p { margin:1em 0;}
#content .board ul { margin:1em 0; padding-left:2em;}
#content .board ol { margin:1em 0; padding-left:2em;}
#content .board li { margin:.2em 0;}
#content .board a { font-weight:bold;}

/* full format */
.ff { font-size:12px; line-height:150%;}
.ff h2 { margin:.8em 0; padding:5px 0; font-size:14px; font-weight:normal;}
.ff p { margin:.8em 0;}
.ff ul, .ff ol { margin:1em 0; padding-left:2.5em;}
.ff li { margin:.2em 0;}

/* CONTENT PAGES */
/* home & archive */
#systip { position:relative; margin:0 0 10px; padding:.5em 1em; border:3px solid #89d5ef; background:#f9fffa;}
#systip h3 { padding:.2em 0; font-size:14px;}
#systip div { padding:.5em 0; border-top:1px solid #eee; border-bottom:1px solid #eee; line-height:1.25em;}
#systip div form p { margin:5px 0;}
#systip div form p.act { text-align:center;}
#systip p.close { text-align:right; line-height:2em;}
#newsfeed { position:relative; margin:0 0 10px; padding:5px; border:1px solid #89d5ef; background:#fff;}
#newsfeed h3 { padding:5px; font-size:14px;}
#newsfeed li { position:relative; clear:both; padding-left:1.7em; border-top:1px solid #eee; background:url(stl_dot_gray.gif) 2% 50% no-repeat; line-height:1.65em; *zoom:1;}
#newsfeed li span.content span { float:left; width:8em;}
#newsfeed li a.hide { position:absolute; top:4px; right:0; width:13px; height:13px; background:url(hide.gif) 0 0 no-repeat; overflow:hidden; font-size:0; line-height:0; text-indent:-999em;}
#newsfeed li a.hide:hover { background-position:0 100%;}
#newsfeed p.close { position:absolute; right:5px; top:5px;}
#newsfeed p.close a.close { display:block; width:13px; height:13px; background:url(close.gif) 0 0 no-repeat; overflow:hidden; font-size:0; line-height:0; text-indent:-999em;}
#newsfeed p.close a.close:hover { background-position:0 100%;}
#update { margin:0 0 10px; border:1px solid #89d5ef; background:#fff;}
#update h2 { padding:.5em 0 0; font-size:14px;}
#update h2 select { font-weight:normal;}
#update form { position:relative; padding:0 10px;}
#update p { margin:.6em 0;}
#update textarea { width:498px; height:5em;}
#update .act { text-align:center;}
#update .tip { position:absolute; right:10px; top:.5em; margin:0; color:#999;}
#update .tip .counter { color:#000; font-weight:bold;}
#sidebar #searchpanel .input_text { width:125px;}
#sidebar #searchpanel .formbutton { width:60px; padding:0; letter-spacing:0;}

/* user & message */
#info { position:relative; margin:0 0 10px; background:url(infosp.gif) 110px 10px no-repeat; *zoom:1;}
#fname { color:#999; font-size:12px; font-weight:normal;}
#relation { font-size:12px; font-weight:normal;}
#info #avatar { float:left; padding:1px; border:1px solid #89d5ef; background:#fff; overflow:hidden;}
#info #avatar img { width:96px; height:96px;}
#latest { min-height:98px; margin-left:120px; border:1px solid #89d5ef; border-left:0; background:#fff url(infobg.gif) bottom repeat-x;}
* html #latest { height:98px;}
#latest h1 { padding:10px 10px 5px; font-size:16px; line-height:100%;}
#latest h1 a.post_act { font-size:12px;}
#latest .current { padding:0 10px 20px; line-height:120%; font-size:14px; word-break:break-all; overflow:hidden; -o-text-overflow:ellipsis;}
#latest .current span.content a.photo { float:right;}
#latest .current span.content a.photo img { display:block; width:72px;}
#latest .current:after { content:"."; display:block; font-size:0; line-height:0; clear:both; visibility:hidden;}
#latest .current { *zoom:1;}
#latest .stamp { position:absolute; right:10px; bottom:5px; line-height:120%;}
#latest .stamp a.post_act { margin-left:1em; color:#555;}
#infos { margin-bottom:10px; word-break:break-all; overflow:hidden; -o-text-overflow:ellipsis;}
#infos li { margin:.5em 0; line-height:1.25em;}

/* album */
#album { padding:.5em 0; border-top:1px solid #ccc; border-bottom:1px solid #ccc; background:#f7f7f7;}
#album table { margin:0 auto; border-collapse:collapse; width:90%;}
#album td { padding:.5em 0; text-align:center; overflow:hidden;}
#album img { padding:4px;}

/* photo */
#crumb { padding:1em 1em 0; padding-left:80px;}
#crumb:after { content:"."; display:block; font-size:0; line-height:0; clear:both; visibility:hidden;}
#crumb { *zoom:1;}
#crumb a.avatar { float:left; margin-left:-65px;}
#crumb h3 { font-size:14px; line-height:200%;}
#crumb h4 { float:left; font-size:12px; font-weight:normal; line-height:250%;}
#crumb ul { float:right; list-style:none; line-height:2em;}
#crumb ul li { display:inline; margin:0 .5em;}
#photo { padding:.2em 0 0; border-top:1px solid #ccc; border-bottom:1px solid #ccc; background:#f7f7f7;}
#photo p.view { margin:.8em 0; text-align:center;}
#photo p.view img { border:1px solid #ccc;}
#photo p.description { margin:.4em 11.5em;}
#photo p.stamp { margin:.4em 11.5em; color:#999;}
#photo p.op { position:relative; top:-2.2em; margin:0 11.5em; text-align:right;}
#photo p.op a { margin-left:.8em;}

/* pm */
#stream.pm ol li.latest { background:#ffa;}
#stream.pm ol p.pm-parent { margin-top:.5em; padding:.5em .8em; background:#eee; color:#666; font-size:12px; line-height:125%;}
#update .pm { margin:10px 10px 0; background:#eee;}

/* friends & followers*/
.actions { font-size:12px;}

/* FUNCTION PAGES */
/* index */
#headline { padding:5px 10px; border-bottom:1px solid #ccc; font-size:18px; font-weight:bold;}
#slogan { list-style:none; padding:0 0 10px 15px;}
#slogan li { height:47px; margin:1em 0; padding:10px 35px 10px 95px;}
#slogan li h3 { margin:.2em 0; color:#333; font-size:14px;}
#slogan li#blogging { background:url(blogging.gif) 0 0 no-repeat;}
#slogan li#friends { background:url(friends.gif) 0 0 no-repeat;}
#slogan li#methods { background:url(methods.gif) 0 0 no-repeat;}

/* search */
#content #searchpanel { margin:5px; padding:1px 10px; border-bottom:1px solid #eee; background:#f7f7f7;}
#content #searchpanel .input_text { width:12em;}

/* invite */
.wp form#invite { margin-top:10px; padding:5px 20px; background:#f7f7f7;}

/* settings */
.settings #avatar { vertical-align:top; margin-right:10px;}
.settings #pro_bas_birthyear { width:4em;}
.settings textarea { height:3.7em;}
#setloginname #url { margin-left:170px;}
#setim .vcode { padding:0 .2em; background:#fffcaa; color:#090; font-size:1.5em; letter-spacing:.1em;}
#setim .bindtip { padding:0 .2em; font-size:1.2em;}
#setim #acc_msnaddr { margin-left:170px;}
#setim #acc_gtalkaddr { margin-left:170px;}
#setim #acc_qqaddr { margin-left:170px;}
#setim #acc_imact { margin-left:170px;}

/* badge */
#badge { width:530px; margin:0 auto; padding:10px 0;}
#badge:after { content:"."; display:block; font-size:0; line-height:0; clear:both; visibility:hidden;}
#badge { *zoom:1;}
#badge .block { margin:10px 0;}
#badge h3, #badge h4 { margin:10px 0; font-size:14px; font-weight:normal;}
#badge h4 { color:#333; font-weight:bold;}
#badge p { margin:5px 0;}
#badge input#width { width:3em;}
textarea.code { width:540px; color:#444; font-size:11px;}
textarea#multi-url, textarea#single-url { height:1.2em;}
textarea#multi-ubb, textarea#single-ubb { height:2.5em;}
textarea#multi-xhtml, textarea#single-xhtml { height:2.5em;}
textarea#user_timeline, textarea#friends_timeline { height:3.7em;}
#preview { float:right;}
textarea#flash_badge { width:320px; height:20em;}

/* api */
#api { width:650px; margin:0 auto; padding:10px 0;}
#api .guide { border-bottom:1px solid #eee; *zoom:1;}
#api .guide:after { content:"."; display:block; font-size:0; line-height:0; clear:both; visibility:hidden;}
#api .gsect { float:left; width:24%; padding:0 0 .5em;}
#api .gsect h4 { padding-left:2em; margin:.5em 0; font-size:12px;}
#api .gsect ol { padding-left:2em;}
#api h2 { margin:.5em 0; padding:.2em 0; font-size:16px; font-weight:bold;}
#api h3 { margin:1em 0;}
#api dl { margin:0; padding:0;}
#api dt { margin:1em 0; border-bottom:1px solid #eee; font-size:12px; font-weight:bold;}
#api dd { margin:.5em;}
#api ul { list-style:none; padding:0;}
#api p { margin:.5em 0;}

/* help */
#basket { float:left; width:180px; padding:10px;}
#basket h2 { font-size:12px;}
#basket ul { margin:1.5em 0; padding-left:20px; color:#999; font-size:13px;}
#basket li { margin:.5em 0;}
#basket li ul { margin:1em 0; padding-left:15px; font-size:12px;}
#basket li.current { color:#000;}
div#help { width:530px; margin-left:200px; *overflow:hidden;}
div#help h2 { margin:10px 0; font-size:14px; font-weight:normal;}
div#help h3 { margin:.5em 0; padding:.2em 0; background:#eee; font-size:12px;}
div#help h4 { margin:10px 0; border-bottom:1px solid #ccc; color:#444; font-size:14px; line-height:2em;}
div#help ol, div#help ul { margin:1.5em 0; padding-left:2em;}
div#help ul { list-style:none;}
div#help li { margin:1em 0;}
div#help p { margin:.8em 0;}

/* share */
.codelet { padding:1em 0 1em 1em; background:#eee;}
.codelet a {}
.codelet span { padding-left:1em;}
.code-sample a { text-decoration:none;}
.code-preview { float:left; width:150px;}
.code-block input { width:360px; font-size:11px;}

/* about */
#about { width:530px; margin:0 auto; padding:10px 0;}
#about h2 { margin:10px 0; font-size:14px; font-weight:normal;}
#about ul { padding:0 85px; list-style:none;}
#about ul li { margin:10px 0; font-size:14px; font-weight:bold;}
#about ul li#generator { font-size:12px; font-weight:normal; text-align:right;}
#about ul span { display:block; margin:5px 0; color:#444; text-decoration:none;}
#about ul label { color:#444; font-weight:normal;}

p.input-tip { position:absolute; padding:4px 17px 4px 4px; border:1px solid #b0e0f0; background:#e4f4fa; color:#0a678a; line-height:15px;}
p.input-tip strong { text-decoration:underline;}
p.input-tip a.close { position:absolute; right:5px; top:6px; display:block; width:13px; height:13px; background:url(close.gif) 0 0 no-repeat; overflow:hidden; font-size:0; line-height:0; text-indent:-999em;}
p.input-tip a.close:hover { background-position:0 100%;}
input.input-question { background:url(../img/stl_question.gif) 98% 50% no-repeat;}

div#poverlay { position:fixed; top:0; width:100%; height:100%; background:#000; opacity:0.5; filter:Alpha(opacity=50); z-index:100;}
div#pwindow { position:fixed; top:50%; left:50%; border:4px solid #666; width:360px; margin-top:-100px; margin-left:-185px; background:#fff; z-index:102;}
div#pwindow h4 { padding:10px 15px 5px; background:#1da4cd url(../img/wbg.gif) 0 100% repeat-x; color:#fff; font-size:14px;}
div#pwindow div.ff { padding:5px 15px;}
div#pwindow div.ff .auto-select { font-size:14px; font-weight:bold;}
div#pwindow div.act { padding:10px 0; border-top:1px solid #ccc; background:#eee; text-align:center;}

